<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <title>自选婚车</title>

    <link rel="stylesheet" type="text/css" href="../lib/weui.css" />
    <link rel="stylesheet" type="text/css" href="../css/jquery-weui.css" />
    <link rel="stylesheet" type="text/css" href="../css/res.css" />
    <link rel="stylesheet" type="text/css" href="css/common.css" />
    <script src="../lib/fastclick.js" type="text/javascript" charset="utf-8"></script>
    <script src="../lib/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/jquery-weui.js" type="text/javascript" charset="utf-8"></script>



</head>

<body ontouchstart>
<div class="weui-tab">
    <!--底部导航栏-->
    <div class="weui-tabbar" style="postion:fixed;left:0;bottom:0;z-index:1000;">
        <a href="main.html" class="weui-tabbar__item weui-bar__item--on">

            <div class="weui-tabbar__icon">
                <img src="images/menu-1-Home@2x.png" alt="">
            </div>
            <p class="weui-tabbar__label">主页</p>
        </a>
        <a href="carSource.html" class="weui-tabbar__item">
            <div class="weui-tabbar__icon">
                <img src="images/menu-2-cheyuan-sel@2x.png" alt="">
            </div>
            <p class="weui-tabbar__label">车源</p>
        </a>
        <a href="service.html" class="weui-tabbar__item">
            <div class="weui-tabbar__icon">
                <img src="images/menu-3-fuwu-sel@2x.png" alt="">
            </div>
            <p class="weui-tabbar__label">服务</p>
        </a>
        <a href="user.html" class="weui-tabbar__item">
            <div class="weui-tabbar__icon">
                <img src="images/menu-4-geren-sel@2x.png" alt="">
            </div>
            <p class="weui-tabbar__label">个人</p>
        </a>
    </div>
    <!--底部导航栏 end-->
    <div class="weui-tab__bd">
        <div id="tab1" class="weui-tab__bd-item weui-tab__bd-item--active">
            <div class="main-header header-title">
                自选婚车信息
            </div>
            <div class="weui-cells weui-cells_form bt-0">
                <div class="weui-cell">
                    <div class="weui-cell__hd">姓名：</div>
                    <div class="weui-cell__bd">
                        <input id="username" class="weui-input ta-r" type="text"  placeholder="请输入您的姓名">
                    </div>

                </div>
                <div class="weui-cell ">
                    <div class="weui-cell__hd">电话：</div>
                    <div class="weui-cell__bd">
                        <input id="phone" class="weui-input ta-r" type="text"  placeholder="请输入您的号码">
                    </div>

                </div>
                <div class="weui-cell ">
                    <div class="weui-cell__hd">品牌：</div>
                    <div class="weui-cell__bd">
                        <input id="" class="weui-input ta-r" type="text"  placeholder="请输入您想要的品牌">
                    </div>

                </div>
                <div class="weui-cell weui-cell_access">
                    <div class="weui-cell__hd"><label class="weui-label">车型</label></div>
                    <div class="weui-cell__bd">
                        <input id="models" class="weui-input ta-r" type="text" value="SUV">
                    </div>
                    <div class="weui-cell__ft"></div>
                </div>

                <div class="weui-cell weui-cell_access">
                    <div class="weui-cell__hd"><label class="weui-label">新车价格</label></div>
                    <div class="weui-cell__bd">
                        <input id="price" class="weui-input  ta-r" type="text" placeholder="20-30万">
                    </div>
                    <div class="weui-cell__ft"></div>
                </div>
                <div class="weui-cell"><div class="weui-cell__bd">备注</div></div>

                <div class="weui-cell">
                    <div class="weui-cell__bd textarea-bor">
                        <textarea class="weui-textarea" placeholder="请注明车身颜色和车辆数" rows="3"></textarea>
                    </div>
                </div>

                <div class="weui-cell weui-cell_access">
                    <div class="weui-cell__hd"><label class="weui-label">时间</label></div>
                    <div class="weui-cell__bd">
                        <input id="date" class="weui-input ta-r" type="text" placeholder="请选择时间">
                    </div>
                    <div class="weui-cell__ft"></div>
                </div>

                <div class="weui-cell weui-cell_access">
                    <div class="weui-cell__hd"><label class="weui-label">详细地址</label></div>
                    <div class="weui-cell__bd">
                        <input id="access" class="weui-input  ta-r" type="text" placeholder="请输入详细地址">
                    </div>
                    <div class="weui-cell__ft"></div>
                </div>




            </div>

            <a id="formSubmitBtn" href="javascript:;" class="weui-btn bth-red">确认提交</a>
            <!--底部空行-->
            <div style="height:45px;" class="">
                &nbsp;
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(function() {
        FastClick.attach(document.body);
    });

    $("#models").picker({
        title: "请选择您的车型",
        cols: [{
            textAlign: 'center',
            values: ['SUV', 'iPhone 4S', 'iPhone 5', 'iPhone 5S', 'iPhone 6', 'iPhone 6 Plus', 'iPad 2', 'iPad Retina', 'iPad Air', 'iPad mini', 'iPad mini 2', 'iPad mini 3']
        }]
    });
    $("#color").picker({
        title: "请选择车色",
        cols: [{
            textAlign: 'center',
            values: ['红色', '黑色', '黄色', '白色', '粉红色']
        }]
    });
    $("#price").picker({
        title: "请选择价位",
        cols: [{
            textAlign: 'center',
            values: ['20-30万', '30-40万', '40-50万', '100万', '1000万']
        }]
    });
    $("#date").datetimePicker({
        title: '自定义格式',
        yearSplit: '年',
        monthSplit: '月',
        dateSplit: '日',
        times: function () {
            return [  // 自定义的时间
                {
                    values: (function () {
                        var hours = [];
                        for (var i=0; i<24; i++) hours.push(i > 9 ? i : '0'+i);
                        return hours;
                    })()
                },
                {
                    divider: true,  // 这是一个分隔符
                    content: '时'
                },
                {
                    values: (function () {
                        var minutes = [];
                        for (var i=0; i<59; i++) minutes.push(i > 9 ? i : '0'+i);
                        return minutes;
                    })()
                },
                {
                    divider: true,  // 这是一个分隔符
                    content: '分'
                }
            ];
        },
        onChange: function (picker, values, displayValues) {
            console.log(values);
        }
    });

</script>
</body>

</html>